<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                template="./../template/admin.xhtml"
                xmlns:h="http://xmlns.jcp.org/jsf/html"
                xmlns:p="http://primefaces.org/ui"
                xmlns:f="http://xmlns.jcp.org/jsf/core">

    <ui:define name="header">
        <f:event type="preRenderView" listener="#{u_memberManagedBean.fixpage('member')}"/>
    </ui:define>

    <ui:define name="context">
        <h:form id="formTable" prependId="false">

            <article class="module width_3_quarter">
                <header><h3 class="tabs_involved">Member Manager</h3></header>

                <div class="tab_container">

                    <div id="tab1" class="tab_content">

                        #{a_memberManagedBean.refreshsetAllMemberList()}
                        <p:dataTable id="TableMember" var="m" value="#{a_memberManagedBean.allMemberList}" 
                                     paginator="true" rows="15" rowsPerPageTemplate="5,10,15"
                                     paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}">

                            <p:column headerText="Language" sortBy="username" width="90%">  
                                ${m.username}
                            </p:column>  

                            <p:column headerText="Actions">

                                <p:growl id="msgEdit" showDetail="true" />
                                <p:commandLink id="editLink" oncomplete="PF('editMemberDialog').show()"
                                               update=":formTable:displayEdit,msgEdit" styleClass="margin-icon">
                                    <h:graphicImage library="admin/images" name="icn_edit.png"/>
                                    <f:setPropertyActionListener value="${m}" 
                                                                 target="#{a_memberManagedBean.editedMember}"/>
                                    <p:ajax update=":formTable:MenuCountry,:formTable:MenuLiking" listener="#{a_memberManagedBean.init_dialog(m)}"/>
                                </p:commandLink>

                                <p:commandLink id="removeLink" update="msgEdit,TableMember"
                                               actionListener="#{a_memberManagedBean.remove(m)}">
                                    <h:graphicImage library="admin/images" name="icn_trash.png"/>
                                    <p:confirm header="Confirmation" message="Are you sure ?" 
                                               icon="ui-icon-alert" />
                                </p:commandLink>

                            </p:column>

                        </p:dataTable>

                        <p:dialog id="dlgEdit" header="Member Detail" widgetVar="editMemberDialog" 
                                  resizable="false"  showEffect="clip" hideEffect="fold" modal="true" >
                            #{a_maritalManagedBean.set_list()}
                            #{a_countryManagedBean.set_list()}  
                            #{a_languageManagedBean.set_list()}
                            #{a_religionManagedBean.set_list()}
                            #{a_casteManagedBean.set_list()}
                            #{a_roleManagedBean.set_list()}
                            #{a_likingsManagedBean.set_list()}
                            <p:scrollPanel style="height:500px">
                                <h:panelGrid id="displayEdit" columns="2" cellpadding="4">

                                    <h:outputText value="ID" />  
                                    <h:outputText value="#{a_memberManagedBean.editedMember.id}"/>

                                    <h:outputText value="Username" />  
                                    <h:inputText value="#{a_memberManagedBean.editedMember.username}"/>

                                    <h:outputText value="Full Name" />  
                                    <h:inputText value="#{a_memberManagedBean.editedMember.fullName}"/>

                                    <h:outputText value="Nick Name" />  
                                    <h:inputText value="#{a_memberManagedBean.editedMember.nickName}"/>

                                    <h:outputText value="Email" />  
                                    <h:inputText value="#{a_memberManagedBean.editedMember.email}"/>

                                    <h:outputText value="Height"/>  
                                    <h:inputText value="#{a_memberManagedBean.editedMember.height}"/>

                                    <h:outputText value="Contact Number" />  
                                    <h:inputText value="#{a_memberManagedBean.editedMember.contactNumber}"/>

                                    <h:outputText value="Working At" />  
                                    <h:inputText value="#{a_memberManagedBean.editedMember.workingAt}"/>

                                    <h:outputText value="Family" />  
                                    <h:inputText value="#{a_memberManagedBean.editedMember.family}"/>

                                    <h:outputText value="Address" />  
                                    <h:inputText value="#{a_memberManagedBean.editedMember.address}"/>

                                    <h:outputText value="Hobbies" />  
                                    <h:inputText value="#{a_memberManagedBean.editedMember.hobbies}"/>

                                    <h:outputLabel value="Birthday"/>
                                    <p:calendar effect="explode" value="#{a_memberManagedBean.editedMember.birthday}"
                                                pattern="yyyy/MM/dd">
                                    </p:calendar>

                                    <h:outputLabel value="Expiration Date"/>
                                    <p:calendar effect="explode" value="#{a_memberManagedBean.editedMember.expirationDate}"
                                                pattern="yyyy/MM/dd">
                                    </p:calendar>

                                    <h:outputText value="Martial Status"/>                      
                                    <h:selectOneMenu value="#{a_memberManagedBean.editedMember.IDMarital.id}" required="true">    
                                        <f:selectItems var="martial" value="#{a_maritalManagedBean.list}" itemLabel="${martial.maritalStatus}" itemValue="${martial.id}"/>  
                                    </h:selectOneMenu>  

                                    <h:outputText value="Country"/>                      
                                    <h:selectOneMenu id="MenuCountry" value="#{a_memberManagedBean.editedCountry.id}" required="true">    
                                        <f:selectItems var="country" value="#{a_countryManagedBean.list}" itemLabel="${country.country}" itemValue="${country.id}"/>  
                                        <p:ajax update="MenuState" listener="#{a_memberManagedBean.handleStateChange()}"/>
                                    </h:selectOneMenu> 

                                    <h:outputText value="State"/>                      
                                    <h:selectOneMenu id="MenuState" value="#{a_memberManagedBean.editedMember.IDState.id}">
                                        <f:selectItems var="state" value="#{a_memberManagedBean.selectStateList}" itemLabel="${state.state}" itemValue="${state.id}"/>  
                                    </h:selectOneMenu> 

                                    <h:outputText value="Language"/>                      
                                    <h:selectOneMenu value="#{a_memberManagedBean.editedMember.IDLanguage.id}">
                                        <f:selectItems var="language" value="#{a_languageManagedBean.list}" itemLabel="${language.language}" itemValue="${language.id}"/>  
                                    </h:selectOneMenu> 

                                    <h:outputText value="Religion"/>                      
                                    <h:selectOneMenu value="#{a_memberManagedBean.editedMember.IDReligion.id}">
                                        <f:selectItems var="religion" value="#{a_religionManagedBean.list}" itemLabel="${religion.religion}" itemValue="${religion.id}"/>  
                                    </h:selectOneMenu> 

                                    <h:outputText value="Catse"/>                      
                                    <h:selectOneMenu value="#{a_memberManagedBean.editedMember.IDCasle.id}">
                                        <f:selectItems var="caste" value="#{a_casteManagedBean.list}" itemLabel="${caste.caste}" itemValue="${caste.id}"/>  
                                    </h:selectOneMenu> 

                                    <h:outputText value="Role"/>                      
                                    <h:selectOneMenu value="#{a_memberManagedBean.editedMember.IDPermission.id}">
                                        <f:selectItems var="role" value="#{a_roleManagedBean.list}" itemLabel="${role.name}" itemValue="${role.id}"/>  
                                    </h:selectOneMenu> 

                                    <h:outputText value="Liking"/>
                                    <p:selectCheckboxMenu id="MenuLiking" value="#{a_memberManagedBean.editedLikings}" label="Likings" 
                                                          filter="true" filterMatchMode="startsWith" 
                                                          panelStyle="width:220px">  
                                        <f:selectItems var="liking" value="#{a_likingsManagedBean.list}" itemLabel="${liking.likings}" itemValue="${liking.id}"/>  
                                    </p:selectCheckboxMenu>

                                    <p:commandButton id="btnEdit" value="Edit" 
                                                     onclick="PF('editMemberDialog').hide();"
                                                     actionListener="#{a_memberManagedBean.edit()}"
                                                     update=":formTable"/>
                                    <p:commandButton value="Cancel" onclick="PF('editMemberDialog').hide();"/>

                                </h:panelGrid>
                            </p:scrollPanel>
                        </p:dialog>

                        <p:confirmDialog global="true" showEffect="fade" hideEffect="explode">  
                            <p:commandButton value="Yes" type="button" styleClass="ui-confirmdialog-yes" 
                                             icon="ui-icon-check"/>  
                            <p:commandButton value="No" type="button" styleClass="ui-confirmdialog-no" 
                                             icon="ui-icon-close"/>       
                        </p:confirmDialog> 

                    </div><!-- end of #tab1 -->

                </div><!-- end of .tab_container -->

            </article><!-- end of content manager article -->

        </h:form>
    </ui:define>

</ui:composition>
